package m.html;

import m.common.action.VueResult;
import m.html.element.Element;
import m.html.element.Text;
import m.html.tab.TabItem;
import m.system.util.JSONMessage;
import m.system.util.StringUtil;

import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;

public class VueTabResult extends VueResult {
    private boolean showHead=true;
    private final String title;
    private String subTitle;
    private String describe;
    private final List<TabItem> items;
    private String indexKey;
    public VueTabResult(String title){
        this(title,new ArrayList<>());
    }
    public VueTabResult(String title,List<TabItem> items){
        this.title=title;
        this.subTitle="";
        this.describe="";
        this.items=items;
        this.indexKey="";
    }
    public VueTabResult hideHead(){
        this.showHead=false;
        return this;
    }
    public VueTabResult setSubTitle(String subTitle) {
        this.subTitle = subTitle;
        return this;
    }
    public VueTabResult setDescribe(String describe) {
        this.describe=describe;
        return this;
    }
    public VueTabResult addItems(TabItem... items){
        this.items.addAll(Arrays.asList(items));
        return this;
    }
    public VueTabResult setIndexKey(String indexKey){
        this.indexKey=indexKey;
        return this;
    }
    @Override
    public String outHtml() {
        Element div=Element.tag("div")
        .E(
            this.showHead?Element.tag("a-page-header")
            .A(":back-icon","false").A("@back","back(false)").A("title",this.title)
            .E(Element.tag("template").A("#subTitle").E(new Text(this.subTitle)))
            .E(
                Element.tag("template").A("#extra")
                .E(
                    Element.tag("a-radio-group").A("v-model:value","indexKey").A("button-style","solid")
                    .E(
                        Element.tag("a-radio-button").A("v-for","(item,key) in tabs.names")
                        .A(":value","key").E(new Text("{{item}}"))
                    )
                )
                .E(Element.tag("m-back").E(new Text("{{param.openType=='PAGE'?'返回':'关闭'}}")).setExtend(" v-if=\"param.isOpen\" @click=\"back(false);\" "))
            ):null
        )
        .E(Element.tag("div").A("style", "padding:0 15px;").E(new Text(this.describe)))
        .E(
            Element.tag("div").A("v-for","(item,name) in tabs.names")
            .A(":id","name+'_div'+key").A("v-show","indexKey==name")
            .E(new Text("<div class=\"padding\"><a-skeleton active /></div>"))
        );

        return "{" +
                "  template:`" + div + "`," +
                "  props: ['localeZh','param','parentVue']," +
                "  data:function(){" +
                "    return {" +
                "      loads:{}," +
                "      tabs:" + toItemDatas() + "," +
                "      indexKey:'" + this.indexKey + "'" +
                "    };" +
                "  }," +
                "  mounted(){" +
                "    this.tabChange();" +
                "  }," +
                "  watch:{" +
                "    indexKey:function(n,o){this.tabChange();}" +
                "  }," +
                "  methods:{" +
                "    tabChange:function(){" +
                "      let i=this.indexKey;" +
                "      if(this.loads[i]){" +
                "        if(this.loads[i].pageFocus) this.loads[i].pageFocus();" +
                "      }else{" +
                "        this.loadPage(i+'_div'+this.key," +
                "          this.tabs.urls[i],this.tabs.params[i]," +
                "          function(pv,v3){" +
                "            this.loads[i]=pv;" +
                "          }.bind(this)" +
                "        );" +
                "        this.loads[i]=true;" +
                "      }" +
                "    }," +
                "  }" +
                "}";
    }
    private JSONMessage toItemDatas(){
        JSONMessage names=new JSONMessage();
        JSONMessage urls=new JSONMessage();
        JSONMessage params=new JSONMessage();
        for(TabItem item : this.items){
            if(StringUtil.isSpace(this.indexKey)) this.indexKey=item.getKey();
            names.push(item.getKey(),item.getName());
            urls.push(item.getKey(),item.getUrl());
            params.push(item.getKey(),item.getParams());
        }
        return new JSONMessage()
            .push("names",names)
            .push("urls",urls)
            .push("params",params);
    }
}
